$(function () {
  // 获得对象(必须引入layui.all.js文件，不然不显示);
  var form = layui.form;
  // 获得layer模块
  const layer = layui.layer;
  //1 点击 去注册账号 的链接
  $("#link_res").on("click", function () {
    $(".login-box").hide();
    $(".reg-box").show();
  });

  //2 点击 去登陆 的链接
  $("#link_login").on("click", function () {
    $(".login-box").show();
    $(".reg-box").hide();
  });

  // 3 正则校验

  form.verify({
    // 自定义pwd校验规则
    pwd: [/^[\S]{6,12}$/, "密码必须6到12位,且不能出现空格"],
    // 校验两次密码是否一致的规则 封装好的话在文本 lay-verify 里添加
    // value就是用户输入第一个密码内容
    repwd: function (value) {
      // 再拿到第二次输入的密码内容
      const pwd = $("#pwd").val();
      // 判断两次是否一致，不一致提示
      if (pwd !== value) return "两次密码不一致";
    },
  });

  // 4.注册功能
  // 4.1 点击事件
  $("#formReg").on("submit", function (e) {
    //4.2 阻止默认事件
    e.preventDefault();
    // 4.3 ajax请求——注册功能
    const data = {
      username: $("#username").val(),
      password: $("#pwd").val(),
    };
    $.post("/api/reguser", data, function (res) {
      console.log(res);
      if (res.status !== 0) {
        return layer.msg(res.message);
      }
      layer.msg("注册成功，请登陆");
      $("#link_login").click();
    });
  });

  // 5 登录功能
  $("#formLogin").on("submit", function (e) {
    e.preventDefault();
    $.ajax({
      url: "/api/login",
      method: "POST",
      // $(this).serialize() 获取用户名和密码
      data: $(this).serialize(),
      success: function (res) {
        if (res.status !== 0) {
          return layer.msg(res.message);
        }
        layer.msg(res.message);
        // 登录成功后，将获取的tpken数据存储到浏览器当中
        localStorage.setItem("tpken", res.token);
        // 登陆成功后，并保存了用户手牌，跳转到index.html
        location.href = "./index.html";
      },
    });
  });
});
